<template>

  <div class="love-integral" :style="'margin-top:' +  name == 'toFreeze'?'-96px':'0'">
    <div>可转换：{{computAmount(name,loveData)}}</div>
    <div  class="content">
    <div>请输入要转化的链盟积分</div>
    <div class="exchange">
      <icon class="iconfont icon-fontclass-jifen"></icon>
      <input type="number" class="input" v-model="love_num"/>
      <div class="all" @click="allLove">全部兑换</div>
    </div>
    <van-field v-model="out_url" placeholder="请输入钱包地址" input-align="right">
      <text slot="label" class="cellTitleStyle">钱包地址:</text>
    </van-field>
    <div class="upload-box">
      <div class="txt" style="margin-bottom:10px">上传收款码</div>
      <el-upload :action="fun.getRealUrl('upload.uploadPic')" limit="1" list-type="picture-card" :on-success="uploadSuccess1"
        :on-remove="handleRemove1">
        <i class="el-icon-plus"></i>
      </el-upload>
      <van-button   style="width:100%;margin-top:20px" type="danger"  @click="confirm">确认转化</van-button>
    </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loveData: {
        love: 0,
        ratio: 0,
        least: 0,
        value: 0
      },
      love_num: "",
      out_url:"",
      fileList:[],
      imgList:[],
      integral: "消费积分",
      loveName: "爱心值",
      name: "",
      point: "积分"
    };
  },
  created() {
    this.getData();
  },
  computed: {

  },
  methods: {
    uploadSuccess1(response, file, fileList) {
      this.fileList = fileList;
    },
    handleRemove1(file, fileList) {
      this.fileList = fileList;
    },
    computAmount(name, loveData) {
      if (name == "consumption_dividend_toPoint") {
        return loveData.amount;
      } else if (name == "toFreeze") {
        return loveData.usable_love;
      } else {
        return loveData.love;
      }
    },
    getData() {
      let json = {};
      let url = 'plugin.love.Frontend.Modules.Love.Controllers.change-integral.index';
      if (this.name == 'point') {
        url = "plugin.love.Frontend.Modules.Love.Controllers.transformation-point.index";
      } else if (this.name == 'consumption_dividend_toPoint') {
        url = "plugin.consume-commission.frontend.exchange.index";
        json.pool_id = this.options.pool_id;
      } else if (this.name == 'toFreeze') {
        url = "plugin.love.Frontend.Modules.Love.Controllers.usable-love.transform-freeze";
      }
      $http.post(url, {}, " ").then(
        res => {
          if(res.result == 1){
            this.loveData = res.data;
          }
          
        },
        function(res) {
          console.log(res);
        }
      );
    },
    confirm(){
      this.imgList = [];
      this.fileList.forEach(item=>{
        this.imgList.push(item.response.data.img_url);
      });
      let love_num = this.love_num;
      let loveData = this.loveData;
      if (love_num <= 0 || love_num === "") {
        this.$toast("转化的数量不能为0，也不能为空");
        return false;
      } else if ((love_num) * 1 > loveData.love * 1) {
        this.$toast("转化的数量不能大于总数量");
        return false;
      } else if (love_num * 1 > (loveData.love - loveData.least) * 1) {
        this.$toast("最低保留" + loveData.least + "爱心值");
        return false;
      }else if(this.out_url === ''){
        this.$toast("请输入钱包地址");
        return false;
      }else if(this.imgList.length === 0){
        this.$toast("请上传收款码");
        return false;
      }
      let json = {
        love_num: this.love_num,
        out_url: this.out_url,
        out_img: this.imgList[0]
      };
      let url = "plugin.love.Frontend.Controllers.cash-out.put-in";
      $http.post(url, json, " ").then(
        res => {
          if(res.result == 1){
            this.love_num ='';
            this.out_url='';
            this.out_img='';
            this.imgList =[];
            this.fileList = [];
            this.$toast("转化成功！");
          }
          
        },
        function(res) {
          this.$toast(res.msg);
        }
      );
    },
    allLove() {
      let {
        love,
        least
      } = this.loveData;
      if (this.name == "toFreeze") {
        this.love_num = this.loveData.usable_love;
        return;
      }
      if (this.name == 'point') {
        this.love_num = love;
        return;
      }
      if (love <= least) {
        this.$toast("当前没有可转换的" + this.loveName);
        return false;
      }
      this.love_num = love - least;
    },
  }
};    
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
.upload-box {
  text-align: left;
  padding:15px;
  background-color: #fff;
}
.love-integral {
  text-align: left;
  padding: 13px;
}
.love-integral .content {
  margin-top: 13px;
  background-color: #fff;
  box-shadow: 0px 1px 4.4px 0px rgba(7, 11, 33, 0.11);
  border-radius: 3.2px;
  padding: 7px 16px;
}
.love-integral .content .exchange {
  display: flex;
  align-items: center;
  border-bottom: 1.1px solid rgba(84, 152, 252, 0.2);
  font-size: 12px;
  padding: 13px 0;
}
.love-integral .content .exchange .input {
  border: none;
  flex: 1;
  padding: 0 16px;
  color: #333;
  font-size: 21px;
  overflow: auto;
}
.love-integral .content .exchange .icon-fontclass-jifen {
  color: #f15353;
  font-size: 21px;
}
.love-integral .content .exchange .all {
  color: #f15353;
}
.love-integral .content .tips {
  color: #888;
  margin: 13px 0;
}
.love-integral .content .confirm {
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  background-color: #f15353;
  border-radius: 6px;
  margin: 0 auto;
}

.upload-box{
  margin-top:15px;
  margin-bottom:15px;
}
.upload-box .txt{
  font-size:14px;
  margin-bottom:15px
}
.van-cell{
  padding:10px 0 !important
}
</style>
